
import Banner from "./components/banner"
import Search from "@/components/Search"
import Share from "@/components/Share"
import SecondKill from "./components/secondKill"
import NoRivals from './components/noRivals'

import Logo from '@/assets/images/home/logo.png'
import cell1 from '@/assets/images/home/r1.png'
import cell2 from '@/assets/images/home/r3.png'
import cell3 from '@/assets/images/home/r4.png'

import './index.less'

const cellList = [
  {
    img:cell1,
    title:'免费领取商品',
    route:'/welfare'
  },
  {
    img:cell2,
    title:'免费领取商品',
    route:'/downActivity'
  },
  {
    img:cell3,
    title:'免费领取商品',
    route:'/homeWelfare'
  }
]

const Home = ()=>{
  return (
    <div className="home">

      <div className="flex items-center hometop place-content-between">
        <img src={Logo} className="logo" alt="" />
        <Search />
        <Share />
      </div>
      <Banner />

      <div className="flex items-center place-content-evenly cell">
        {
          cellList.map((item)=>{
            return <div className="flex items-center place-content-center flex-col" key={item.route}>
              <img src={item.img} alt="" />
              <span>{item.title}</span>
            </div>
          })
        }
      </div>

      <div className="floatCard">
        <SecondKill key={'SecondKill'} />

        <NoRivals key={'NoRivals'}  />

      </div>

    </div>
  )
}

export default Home